<template>
  <div class="mine-row" :style="{ width: `${level * size}px`, height: `${size}px` }">
    <mine-item v-for="(item, index) in mines" :key="index" :size="size" v-bind="item" v-on="$listeners"></mine-item>
  </div>
</template>

<script>
import MineItem from './MineItem';

export default {
  name: 'mineRow',
  components: {
    MineItem
  },
  props: {
    mines: {
      type: Array,
      default: () => []
    },
    level: Number,
    size: Number
  },
  data() {
    return {};
  }
};
</script>

<style lang="less" scoped>
.mine-row {
  overflow: hidden;
}
</style>
